<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>03_元素是行操作</title>
		<!-- 
		 元素属性操作：针对固定属、附加属性操作
		  元素    固定属性---清楚：元素是否可用属性
				 附加属性---清楚：表单为主，附加属性checked、disabled...
		 prop()        ----功能：与attr类似，附加属性，针对表单，默认选中
		 removeProp()  ----功能：与removeAttr类似，附加属性，针对表单，移除选中
		 -->
		 <script src="../js/jquery-1.11.1.js"></script>
	</head>
	<body>
		<h1>prop()和removeProp()函数使用</h1>
		<!-- 复选框，默认选中  id="myCheckBox"
			三个按钮        id="getPropBtn"   获取属性
							id="setPropBtn"  设置属性
							id="removePropBtn"移除属性
							
		 -->
		 <input type="checkbox" id="myCheckBox" checked />
		 <button id="getPropBtn">获取属性</button>
		 <button id="setPropBtn">设置属性</button>
		 <button id="removePropBtn">移除属性</button>
		 <div id="output"></div>
		 <script>
			 /* prop()  点击--获取属性--打印复选框的值
										复选框的值是：+变量
				prop()---input元素--checked属性--属性值bool[true,false]
			 */
			$("#getPropBtn").click(function(){
				//prop()获取元素的附加属性---input中的checked
				var mycheck=$("#myCheckBox").prop("checked");
				$("#output").text("复选框的值是："+mycheck);
			});
			//prop("checked",false)
			$("#setPropBtn").click(function(){
				$("#myCheckBox").prop("checked",false);
				$("#output").text("复选框的值是：false");
			});
			//removeProp() 取消选中--删除checked属性
			$("#removePropBtn").click(function(){
				//prop()获取元素的附加属性---input中的checked
				$("#myCheckBox").removeProp("checked");
				$("#output").text("复选框的属性已经移除");
			});
		 </script>
	</body>
</html>